import 'package:flutter/material.dart';
import 'package:homepad/logger/logger.dart';
import 'package:homepad/iot/basic_node.dart';
import 'package:homepad/models/nova_model.dart';
import 'package:homepad/styles.dart';
import 'package:homepad/views/animation_icon.dart';
import 'package:provider/provider.dart';

class PanelServiceHeader extends StatelessWidget {
  final BasicNode node;
  final double height;

  const PanelServiceHeader({super.key, required this.node, this.height = 90});

  @override
  Widget build(BuildContext context) {
    final isFan = node.icon == "icon_font_fan";

    final MyStyles styles = Theme.of(context).extension<MyStyles>()!;
    final iconColor = isFan ? styles.fanHighlightColor : styles.lightHighlightColor;

    BasicNodeState state = context.select<NovaModel, BasicNodeState>((nova) => node.state);
    String desc = context.select<NovaModel, String>((nova) => node.desc);

    final lightColor = state == BasicNodeState.activated ? iconColor : styles.lightNormalColor;
    final lightBackgroundColor = styles.iconBackgroundColor;
    const textColor = Colors.white;

    logger.info("node.desc: $desc");

    var iconAvatar = CircleAvatar(
      maxRadius: (height - 20) / 2,
      backgroundColor: lightBackgroundColor,
      child: Padding(
          padding: const EdgeInsets.all(3),
          child: Image(
            fit: BoxFit.fill,
            width: (height - 20).toDouble(),
            color: lightColor,
            image: AssetImage("assets/images/${node.icon}.png"),
          )),
    );

    return SizedBox(
      height: height,
      child: Stack(
        children: [
          Positioned(
            top: 15,
            left: 15,
            child: GestureDetector(
              onTap: () {
                node.toggle();
              },
              child: isFan && state == BasicNodeState.activated
                  ? AnimationIcon(child: iconAvatar)
                  : iconAvatar,
            ),
          ),
          Positioned(
              left: 100,
              top: 20,
              child: Text(node.name,
                  style: styles.titleStyle.copyWith(letterSpacing: 0.45, color: textColor))),
          Positioned(
              left: 100,
              bottom: 13,
              child: Text(desc, style: styles.textStyle.copyWith(fontSize: 18, color: textColor)))
        ],
      ),
    );
  }
}
